<template>
    <div>
        {{count}}
        <h1>注册</h1>
        账号：<input type="text" v-model="username"><br>
        密码：<input type="text" v-model="password"><br>
        真实姓名：<input type="text" v-model="name"><br>
        身份证号：<input type="text" v-model="identity"><br>
        地址：<input type="text" v-model="home"><br>
        <button @click="reg">注册</button>

    </div>
</template>

<script>
import axios from 'axios'
export default {
    data(){
        return{
            username:'',
            password:'',
            name:'',
            identity:'',
            home:'',
            socket:'',
            count: 0
        }
    },
    methods:{
        reg(){
            axios({
                url : 'http://127.0.0.1:8000/register/',
                method : 'post',
                data:{'username':this.username,'password':this.password,'name':this.name,'identity':this.identity,'home':this.home}
            }).then(res =>{
                console.log(res.data)
                alert(res.data.msg)
            })
        },

        websocketonmessage(e) {
            let dataJson = JSON.parse(e.data)
            this.count = dataJson.count
            },

            // 连接stocket 获取信息
            testsocket() {
            const soc = `ws://127.0.0.1:8000/test_websocket/` // websocket地址
            console.log(soc)
            this.socket = new WebSocket(soc)
            this.socket.onmessage = this.websocketonmessage
            },

    },
    mounted(){
        this.testsocket()
    }

}
</script>

<style>

</style>